import 'package:flutter/material.dart';
import 'package:get/get.dart';
import '../controllers/settings_controller.dart';
import '../../../routes/app_pages.dart';

/// 设置页面 - 应用配置和用户偏好管理
/// Settings Page - Application configuration and user preference management
class SettingsView extends GetView<SettingsController> {
  const SettingsView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('设置'),
        backgroundColor: Colors.transparent,
        elevation: 0,
        flexibleSpace: Container(
          decoration: const BoxDecoration(
            gradient: LinearGradient(
              colors: [Color(0xFF667eea), Color(0xFF764ba2)],
              begin: Alignment.topLeft,
              end: Alignment.bottomRight,
            ),
          ),
        ),
      ),
      body: Container(
        decoration: const BoxDecoration(
          gradient: LinearGradient(
            colors: [Color(0xFFf093fb), Color(0xFFf5576c)],
            begin: Alignment.topCenter,
            end: Alignment.bottomCenter,
          ),
        ),
        child: SafeArea(
          child: SingleChildScrollView(
            padding: const EdgeInsets.all(16.0),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                _buildUserProfileCard(),
                const SizedBox(height: 16),
                _buildNetworkSettingsCard(),
                const SizedBox(height: 16),
                _buildAppearanceCard(),
                const SizedBox(height: 16),
                _buildDataManagementCard(),
                const SizedBox(height: 16),
                _buildAboutCard(),
              ],
            ),
          ),
        ),
      ),
    );
  }

  /// 用户资料卡片 User Profile Card
  Widget _buildUserProfileCard() {
    return Card(
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16),
          gradient: const LinearGradient(
            colors: [Colors.white, Color(0xFFF8F9FA)],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        child: Column(
          children: [
            CircleAvatar(
              radius: 40,
              backgroundColor: Colors.blue.withOpacity(0.1),
              child: const Icon(
                Icons.person,
                size: 40,
                color: Colors.blue,
              ),
            ),
            const SizedBox(height: 12),
            const Text(
              '游戏Wiki用户',
              style: TextStyle(
                fontSize: 18,
                fontWeight: FontWeight.bold,
                color: Color(0xFF2D3748),
              ),
            ),
            const SizedBox(height: 4),
            Text(
              '探索游戏世界的知识',
              style: TextStyle(
                fontSize: 14,
                color: Colors.grey.shade600,
              ),
            ),
          ],
        ),
      ),
    );
  }

  /// 网络设置卡片 Network Settings Card
  Widget _buildNetworkSettingsCard() {
    return Card(
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16),
          gradient: const LinearGradient(
            colors: [Colors.white, Color(0xFFF8F9FA)],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: Colors.purple.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Icon(Icons.network_check, color: Colors.purple),
                ),
                const SizedBox(width: 12),
                const Text(
                  '网络设置',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF2D3748),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 16),
            _buildSettingItem(
              icon: Icons.favorite_outline,
              title: '我的收藏',
              subtitle: '查看收藏的游戏和攻略',
              onTap: () => Get.toNamed(Routes.FAVORITES),
            ),
            _buildSettingItem(
              icon: Icons.history,
              title: '浏览历史',
              subtitle: '查看最近浏览记录',
              onTap: () => Get.toNamed(Routes.HISTORY),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.wifi,
              title: '网络诊断',
              subtitle: '检查网络连接状态',
              onTap: controller.runNetworkDiagnostic,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
          ],
        ),
      ),
    );
  }

  /// 外观设置卡片 Appearance Card
  Widget _buildAppearanceCard() {
    return Card(
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16),
          gradient: const LinearGradient(
            colors: [Colors.white, Color(0xFFF8F9FA)],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: Colors.orange.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Icon(Icons.palette, color: Colors.orange),
                ),
                const SizedBox(width: 12),
                const Text(
                  '外观设置',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF2D3748),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 16),
            _buildSettingItem(
              icon: Icons.dark_mode,
              title: '深色模式',
              subtitle: '切换应用主题',
              onTap: null,
              trailing: Obx(() => Switch(
                value: controller.isDarkMode.value,
                onChanged: controller.toggleDarkMode,
                activeColor: Colors.orange,
              )),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.language,
              title: '语言设置',
              subtitle: '选择应用语言',
              onTap: controller.showLanguageDialog,
              trailing: Obx(() => Text(
                controller.currentLanguage.value,
                style: const TextStyle(
                  color: Colors.grey,
                  fontSize: 14,
                ),
              )),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.text_fields,
              title: '字体大小',
              subtitle: '调整文字显示大小',
              onTap: controller.showFontSizeDialog,
              trailing: Obx(() => Text(
                controller.currentFontSize.value,
                style: const TextStyle(
                  color: Colors.grey,
                  fontSize: 14,
                ),
              )),
            ),
          ],
        ),
      ),
    );
  }

  /// 数据管理卡片 Data Management Card
  Widget _buildDataManagementCard() {
    return Card(
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16),
          gradient: const LinearGradient(
            colors: [Colors.white, Color(0xFFF8F9FA)],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: Colors.green.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Icon(Icons.storage, color: Colors.green),
                ),
                const SizedBox(width: 12),
                const Text(
                  '数据管理',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF2D3748),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 16),
            _buildSettingItem(
              icon: Icons.favorite,
              title: '收藏管理',
              subtitle: '管理收藏的Wiki页面',
              onTap: () => Get.toNamed('/favorites'),
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.history,
              title: '浏览历史',
              subtitle: '查看和管理浏览记录',
              onTap: () => Get.toNamed('/history'),
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.cached,
              title: '清除缓存',
              subtitle: '清理应用缓存数据',
              onTap: controller.clearCache,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.backup,
              title: '数据备份',
              subtitle: '备份收藏和设置',
              onTap: controller.backupData,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
          ],
        ),
      ),
    );
  }

  /// 关于卡片 About Card
  Widget _buildAboutCard() {
    return Card(
      elevation: 8,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(16)),
      child: Container(
        padding: const EdgeInsets.all(16),
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(16),
          gradient: const LinearGradient(
            colors: [Colors.white, Color(0xFFF8F9FA)],
            begin: Alignment.topLeft,
            end: Alignment.bottomRight,
          ),
        ),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Row(
              children: [
                Container(
                  padding: const EdgeInsets.all(8),
                  decoration: BoxDecoration(
                    color: Colors.blue.withOpacity(0.1),
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: const Icon(Icons.info, color: Colors.blue),
                ),
                const SizedBox(width: 12),
                const Text(
                  '关于应用',
                  style: TextStyle(
                    fontSize: 18,
                    fontWeight: FontWeight.bold,
                    color: Color(0xFF2D3748),
                  ),
                ),
              ],
            ),
            const SizedBox(height: 16),
            _buildSettingItem(
              icon: Icons.info_outline,
              title: '应用信息',
              subtitle: '版本号和开发信息',
              onTap: controller.showAppInfo,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.help_outline,
              title: '帮助与支持',
              subtitle: '使用指南和常见问题',
              onTap: controller.showHelp,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
            const Divider(),
            _buildSettingItem(
              icon: Icons.privacy_tip,
              title: '隐私政策',
              subtitle: '了解数据使用政策',
              onTap: controller.showPrivacyPolicy,
              trailing: const Icon(Icons.arrow_forward_ios, size: 16),
            ),
          ],
        ),
      ),
    );
  }

  /// 设置项 Setting Item
  Widget _buildSettingItem({
    required IconData icon,
    required String title,
    required String subtitle,
    VoidCallback? onTap,
    Widget? trailing,
  }) {
    return InkWell(
      onTap: onTap,
      borderRadius: BorderRadius.circular(8),
      child: Padding(
        padding: const EdgeInsets.symmetric(vertical: 8),
        child: Row(
          children: [
            Container(
              padding: const EdgeInsets.all(8),
              decoration: BoxDecoration(
                color: Colors.grey.withOpacity(0.1),
                borderRadius: BorderRadius.circular(8),
              ),
              child: Icon(icon, color: Colors.grey.shade600, size: 20),
            ),
            const SizedBox(width: 12),
            Expanded(
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    title,
                    style: const TextStyle(
                      fontSize: 16,
                      fontWeight: FontWeight.w500,
                      color: Color(0xFF2D3748),
                    ),
                  ),
                  const SizedBox(height: 2),
                  Text(
                    subtitle,
                    style: TextStyle(
                      fontSize: 12,
                      color: Colors.grey.shade600,
                    ),
                  ),
                ],
              ),
            ),
            if (trailing != null) trailing,
          ],
        ),
      ),
    );
  }
}